<template>
  <el-container class="main_con">
    <!-- <div ref="copyDom"> -->
    <div class="filter_con ds_block">
      <h2 class="button_area">审核优惠券</h2>
      <div class="filter_area">
        <el-input
          class="serach_input mr_15 mt_15"
          size="medium"
          v-model="obj.name"
          placeholder="优惠券名字"
          style="width:300px"
        ></el-input>
        <label class="mr_15 mt_15">状态</label>
        <el-select size="medium" v-model="obj.audit" placeholder="请选择" class="mr_15 mt_15">
          <el-option
            v-for="item in options"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          ></el-option>
        </el-select>
        <el-button class="mr_15 mt_15" @click="searchList" size="medium">搜索</el-button>
      </div>
    </div>
    <div class="list_con">
      <el-table :data="list" element-loading-text fit highlight-current-row>
        <el-table-column prop="name" label="优惠券名称"></el-table-column>
        <el-table-column label="优惠内容" width="400px">
          <template slot-scope="scope">满{{ scope.row.conditions }}减{{ scope.row.denomination }}</template>
        </el-table-column>
        <el-table-column prop="create_time" label="创建时间" width="200px"></el-table-column>
        <el-table-column prop="audit_text" label="审核状态" width="200px">
          <template slot-scope="scope">
            <span v-if="scope.row.audit==0">未审核</span>
            <span v-if="scope.row.audit==2">被驳回</span>
          </template>
        </el-table-column>
        <el-table-column prop="audit_remark" label="说明" v-if="urlType =='shop'">
          <template slot-scope="scope">
            <span v-html="scope.row.audit_remark"></span>
          </template>
        </el-table-column>
        <el-table-column label="操作" width="240px" v-if="urlType == 'mall'">
          <template slot-scope="scope">
            <el-button v-has="'audit'" type="text" @click="editItem(scope.row.id)">审核</el-button>
          </template>
        </el-table-column>
      </el-table>
      <div class="table_footer" style="justify-content: flex-end;" v-show="total != 0">
        <el-pagination
          @current-change="changePage"
          :current-page="page"
          class="pages"
          background
          hide-on-single-page
          layout="prev, pager, next"
          :total="total"
        ></el-pagination>
      </div>
    </div>
  </el-container>
</template>

<script>
import { logintype_byurl } from "@/utils/auth";
import { getMadminCouponList, getCouponList } from "@/api/shop/marketing";
export default {
  data() {
    return {
      obj: {
        name: "",
        audit: [0, 2]
      },
      options: [
        {
          value: -1,
          label: "全部"
        },
        {
          value: 0,
          label: "未审核"
        },
        {
          value: 2,
          label: "被驳回"
        }
      ],
      total: 0,
      page: 1,
      size: 10,
      list: [],
      objTemp: {},
      isExamine: true,
      urlType: ""
    };
  },
  created() {
    this.urlType = logintype_byurl();
    this.searchList();
  },
  methods: {
    // 获取所有优惠券列表
    getuserCouponList() {
      if (this.urlType == "mall") {
        getMadminCouponList(this.objTemp, this.page, this.size).then(res => {
          console.log(res)
          this.list = res.msg.data;
          this.total = res.msg.total;
        });
      } else if (this.urlType == "shop") {
        getCouponList(this.objTemp, this.page, this.size).then(res => {
          this.list = res.msg.data;
          this.total = res.msg.total;
        });
      }
    },
    changePage(page) {
      this.page = page;
      this.searchList();
    },
    editItem(id) {
      this.$router.push({
        path: "/coupon/item",
        query: { id: id, k: Math.random(), isExamine: this.isExamine }
      });
    },
    searchList() {
      this.objTemp = Object.assign({}, this.obj);
      if (this.objTemp.audit == -1) {
        this.objTemp.audit = [0, 2];
      }
      this.page = 1
      this.getuserCouponList();
    }
  }
};
</script>

<style lang="scss" scoped>
.product-item {
  display: flex;
  align-items: center;

  img {
    width: 40px;
    height: 40px;
    margin-right: 10px;
  }
}

.user_list {
  .title {
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 10px;
  }

  .selected {
    display: flex;
    flex-wrap: wrap;
    max-height: 150px;
    overflow-y: auto;

    .user_item {
      padding: 0 10px;
      font-size: 12px;
      height: 28px;
      line-height: 28px;
      border: 1px solid #dcdfe6;
      margin: 0 10px 10px 0;
      border-radius: 5px;
      flex-shrink: 0;

      i {
        cursor: pointer;
      }
    }
  }

  .btn {
    margin-bottom: 10px;
  }
}
</style>
